<template>
  <div class="title">
    <span :class="{active : $store.state.taskName.length != 0}">全部任务（{{$store.state.taskName.length}}）</span>
    <span>已完成（{{$store.state.taskName.length - $store.getters.filterFlase }}）</span>
    <span>未完成（{{$store.getters.filterFlase}}）</span>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
    .title{
        margin-bottom: 10px;
        span{
            font-size: 14px;
            box-sizing: border-box;
            padding: 3px 6px;
            background-color: lightskyblue;
            margin-right: 10px;
            border-radius: 3px;
            color: white;
            &:last-child{
                background-color: red;
            }
        }

    }

</style>